<template>
  <PageWrapper dense>
    <BasicTable @register="registerTable">
      <template #toolbar>
        <a-button type="primary" @click="viewItems"> {{ t('common.billDetails') }}</a-button>
        <a-button type="primary" @click="handleEdit">{{ t('common.add') }}</a-button>

        <BatchButton
          :batchData="getSelectRowKeys"
          :actions="[
            {
              icon: 'ant-design:delete-outlined',
              label: t('common.delText'),
              confirmText: t('common.isDel'),
              onClick: handleDelete,
              disabled: isDisabled('del', getSelectRows()),
            },
          ]"
        />
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'action'">
          <TableAction
            :actions="[
              {
                icon: 'ant-design:edit-outlined',
                tooltip: t('common.edit'),
                onClick: handleEdit.bind(null, record.BillId, false),
                disabled: isDisabled('del', record),
              },
              {
                icon: 'ant-design:delete-outlined',
                color: 'error',
                tooltip: t('common.delText'),
                popConfirm: {
                  title: t('common.isDel'),
                  placement: 'left',
                  confirm: handleDelete.bind(null, [record.BillId]),
                },
                disabled: isDisabled('del', record),
              },
            ]"
          />
        </template>
      </template>
    </BasicTable>
  </PageWrapper>
</template>
<script lang="ts" setup name="<%= data.name %>">
  // ----------------------------- 第三方引入 -----------------------------

  // ----------------------------- hooks引入 -----------------------------
  import { useAppRouter } from '/~/hooks/help/useAppRouter';
  import { useAppTable } from '/~/hooks/help/useAppTable';
  import { useI18n } from '/@/hooks/web/useI18n';
  // ----------------------------- 组件引入 -----------------------------
  import { BasicTable, TableAction } from '/@/components/Table';
  import { PageWrapper } from '/@/components/Page';
  import { BatchButton } from '/~/components/BatchButton';
  // ----------------------------- 其他引入 -----------------------------
  import <%= data.alias %>Api from '/@/api/work/<%= data.api %>';
  import { tableColumns, formSchemas } from './schema.data';
  import { useBillState } from '/~/hooks/work/useBillState';
  //----------------------------- 变量声明区 -----------------------------

  // ----------------------------- hooks使用区 -----------------------------
  const { push } = useAppRouter();
  const { isDisabled } = useBillState();
  const { t } = useI18n();
  const [registerTable, { reload, getSelectRowKeys, getSelectRows }] = useAppTable({
    // 列表接口api
    api: <%= data.alias %>Api.api_list,

    title: t('routes.menu.<%= data.name %>'),
    columns: tableColumns,
    formConfig: {
      schemas: formSchemas,
    },
    rowSelection: { type: 'checkbox' },
    actionColumn: {
      width: 100,
    },
  });
  // ----------------------------- 钩子函数区 -----------------------------

  //  ----------------------------- 自定义方法区 -----------------------------
  // 删除单据
  async function handleDelete(Ids: string[]) {
    console.log(Ids);
    await <%= data.alias %>Api.api_delete({ Ids });
    reload();
  }
  // 跳转编辑页
  function handleEdit(Id, isNew = true) {
    push({
      name: '<%= data.name %>_Edit',
      query: isNew
        ? {}
        : {
            Id,
          },
    });
  }
  function viewItems() {
    push({
      name: '<%= data.name %>_Items',
    });
  }
</script>
<style lang="less" scoped></style>
